import React from "react";
import "react-native-gesture-handler";

import { NavigationContainer } from "@react-navigation/native";
import { createDrawerNavigator } from "@react-navigation/drawer";
import { navigationRef } from "./src/screens/NavigationServe";

import LoginStack from "./src/screens/LoginStack";
// import TestX from "./src/screens/TestX";
// import MainTabScreen from "./src/screens/MainTabScreen";
// import AdminMainTab from "./src/screens/AdminMainTab";
import UserQuesNavigation from "./src/navigation/UserQuesNavigation";
import QuestionnaireNavigation from "./src/navigation/QuestionnaireNavigation";

import { Provider, useSelector } from "react-redux";
import { store } from "./src/store/index";

import { DrawerContent } from "./src/screens/user/DrawerContent";

const Drawer = createDrawerNavigator();

const DrawerNav = () => {
  const aauthRole = useSelector((state) => state.authR.authRole);
  return (
    <Drawer.Navigator drawerContent={(props) => <DrawerContent {...props} />}>
      <Drawer.Screen
        name="HomeDrawer"
        component={
          aauthRole === "user" ? UserQuesNavigation : QuestionnaireNavigation
        }
        options={{ headerShown: false, gestureEnabled: true }}
      />
    </Drawer.Navigator>
  );
};

const RootNavigation = () => {
  const aauthToken = useSelector((state) => state.authR.authToken);
  const isSignIn = useSelector((state) => state.authR.isSignIn);
  return (
    <NavigationContainer ref={navigationRef}>
      {aauthToken != null && isSignIn ? <DrawerNav /> : <LoginStack />}
    </NavigationContainer>
  );
};

export default function App() {
  return (
    <Provider store={store}>
      <RootNavigation />
    </Provider>
  );
}
